import {
  Component, OnInit, ViewChild, Input, Output, EventEmitter, AfterViewInit,
  AfterViewChecked, AfterContentInit
} from '@angular/core';
import {ModalDirective} from 'ngx-bootstrap/modal';
import {HttpUtils} from "../../utils/http.utils";
import {mobileValidator, passwordValidator, equalValidator, verifyValidator} from "../../utils/validator.utils";
import {FormGroup, FormControl, FormBuilder, Validators} from "@angular/forms";
import {SMS} from "../../service/sms.service";
import {APARTMENT} from "../../service/apartment.service";
import {WfToast} from "../../utils/toast.utils";
import {LocalStorage} from "../../app.local-storage";
import {UserModel} from "../../model/user.model";
import {USER} from "../../service/user.service";
import {selectDate} from "../../lib/datepicker/datepicker.component";
declare var $:any;

@Component({
  selector: 'booking-house-modal-view',
  templateUrl: './booking-house-modal-view.component.html',
  styleUrls: ['./booking-house-modal-view.component.scss']
})
export class BookingHouseModalViewComponent implements OnInit {
  @ViewChild('bookingModal') public bookingModal:ModalDirective;
  @Input('showModal') public isModalShown:boolean = false;
  @Output('modalClose') public modalClose = new EventEmitter();
  @Input()
  apartmentId:number;
  info = {
    department: 1,
    type: 1,
    sex: 1
  };
  checkingTime:selectDate = new selectDate('');
  typeList:any = [];
  departments:any = [];
  user:any = UserModel;
  timer:any;
  num:number = 60;
  disabled:boolean = false;
  getVerTitle:string = "获取验证码";
  bookingForm:FormGroup;

  constructor(private apartment:APARTMENT,
              private USER:USER,
              private SMS:SMS,
              private fb:FormBuilder,
              private toast:WfToast,
              private localStorage:LocalStorage) {
    this.bookingForm = fb.group({
      buzProduct: [''],
      buzItem: [''],
      phone: ['', mobileValidator],
      name: [''],
      verifyCode: ['', verifyValidator],
      content: [''],
      sex: [1]
    });
  }

  getDate(event:selectDate) {
    this.checkingTime = event;
  }

  setUserInfo() {
    if (this.user) {
      this.bookingForm.controls.name.setValue(this.user.name);
      this.bookingForm.controls.sex.setValue(this.user.sex);
      this.bookingForm.controls.phone.setValue(this.user.username);
      this.disabled = false;
    } else {
      this.bookingForm.controls.name.setValue('');
      this.bookingForm.controls.sex.setValue(1);
      this.bookingForm.controls.phone.setValue('');
    }
  }

  loadDepartment() {
    //获取公寓列表
    let reqData = {
      // enabled: 1,
      // city: undefined,
      page: 0,
      size: 7
    };
    this.apartment.getList(reqData, (resp:any) => {
      let list = [];
      for (let item of resp.content as Array<any>) {
        list.push(item);
      }
      this.departments = list;
      this.loadLayoutType();
    });
  }

  loadLayoutType() {
    //获取公寓的房型列表
    let departmentId = this.bookingForm.get('buzProduct').value;
    if (departmentId == undefined) {
      return;
    }
    this.apartment.getLayoutList(departmentId, (resp:any) => {
      let list = [{id: '', name: '所有房型'}];
      for (let item of resp as Array<any>) {
        list.push(item);
      }
      this.typeList = list;
    });
  }

  doBooking() {
    let reqData = {
      buzProduct: this.bookingForm.get('buzProduct').value,
      buzItem: this.bookingForm.get('buzItem').value,
      phone: this.bookingForm.get('phone').value,
      name: this.bookingForm.get('name').value,
      verifyCode: this.bookingForm.get('verifyCode').value,
      content: this.bookingForm.get('content').value,
      sex: this.bookingForm.get('sex').value,
      startTime: this.checkingTime.date
    };
    let close = this.modalClose;
    this.apartment.appoint(reqData, (resp:any) => {
      this.USER.update(new UserModel(resp));
      close.emit(false);
      this.toast.msg('预约成功');
    });
  }

  doVerify() {
    this.SMS.send(this.bookingForm.get('phone').value, (data:any) => console.log("sms", data));
    this.disabled = true;
    this.timer = setInterval(() => {
      this.num--;
      this.getVerTitle = this.num + '秒';
      if (this.num === 0) {
        clearInterval(this.timer);
        this.disabled = false;
        this.num = 60;
        this.getVerTitle = '获取验证码';
      }
    }, 1000);
  }

  public showModal():void {
    this.loadDepartment();
    this.isModalShown = true;
  }

  public hideModal():void {
    this.bookingModal.hide();
  }

  public onHidden():void {
    this.isModalShown = false;
  }

  ngOnInit() {
    this.user = this.localStorage.getObject('user')as UserModel;
    this.setUserInfo();
  }
}
